<%--
  Created by IntelliJ IDEA.
  User: 柚木
  Date: 2022/12/23
  Time: 12:31
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="css/loginRegisterPage.css">
    <script src="https://kit.fontawesome.com/e91f25b25e.js" crossorigin="anonymous"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
    <title>用户注册</title>
</head>
<body>
<div class="w">
    <div class="main-frame">
        <div class="main-frame-left">
            <img src="../images/register.png" alt="" class="login-image">
        </div>

        <div class="main-frame-right">
            <a href="allBook" class="allBook-link">游客</a>
            <h2 class="form-title">创建账户</h2>
            <p class="form-welcome">------------    图书管理系统欢迎您的注册    ------------</p>
            <div class="form">
                <form action="#" method="post">
                    <div class="form-item">
                        <label class="form-item-icon">
                            <i class="fa fa-light fa-user"></i>
                        </label>
                        <input type="text" class="form-item-input" id="registerUsername" placeholder="请输入用户名" autocomplete="off">
                        <div class="form-item-errorMsg">
                            <!-- <i class="fa fa-light fa-circle-info"></i> -->
                            <label class="form-errorMsg-msg" id="usernameMsg"></label>
                        </div>
                    </div>
                    <div class="form-item">
                        <label class="form-item-icon">
                            <i class="fa fa-light fa-lock"></i>
                        </label>
                        <input type="password" class="form-item-input" id="registerPassword" placeholder="请输入密码" autocomplete="off">
                        <div class="form-item-errorMsg">
                            <!-- <i class="fa fa-light fa-circle-info"></i> -->
                            <label class="form-errorMsg-msg" id="passwordMsg"></label>
                        </div>
                    </div>

                    <script>
                        <%-- 增加时间戳来更换验证码图片 --%>
                        window.onload=function(){
                            document.getElementById("verify-img").onclick=function(){
                                this.src = "verify?time=" + new Date().getTime();
                            }
                        }
                    </script>
                    <div class="form-verify">
                        <img class="verify-image" id="verify-img" src="verify">
                        <input type="text" class="verify-input" id="inputCode" placeholder="请输入验证码">
                    </div>

                    <input type="submit" value="注册" class="btn form-button"><br>
                    <div class="form-loginlink">
                        <span class="login">已有账户？→</span>
                        <a href="login"><span class="link">登录</span></a>
                    </div>

                </form>
            </div>
        </div>

    </div>
</div>
<script src="js/loginRegister.js"></script>
</body>
</html>